<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>苹果导航</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimun-scale=1,maximun-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="css/banner.css"/>
		<link rel="stylesheet" type="text/css" href="css/hbanner.css"/>
	</head>
	<body>
		<div id="nav" class="nav">
			<a href="" class="logo"></a>
			<a href="" class="text">Mac</a>
			<a href="" class="text">IPAD</a>
			<a href="" class="text">IPHONE</a>
			<a href="" class="text">WATCH</a>
			<a href="" class="text">TV</a>
			<a href="" class="text">MUSIC</a>
			<a href="" class="text">SUPPORT</a>
			<a href="" class="search"></a>
			<a href="" class="buy"></a>
			<input hidden="hidden" type="checkbox" name="choose" id = "choose" value="" />
			<label for="choose" class="toggleBtn">
				<span class="line"></span>
				<span class="line"></span>
			</label>
			 
			 <div class="navpage">
			 	<div class="navMain">
					<div class="searchInput">
						<div class="icon"></div>
						<input type="text" placeholder="Search apple.cn">
					</div>
					<hr/>
					<div class="navList">
						<a href="" class="navText">MAC</a>
						<a href="" class="navText">IPAD</a>
						<a href="" class="navText">IPHONE</a>
						<a href="" class="navText">WATCH</a>
						<a href="" class="navText">TV</a>
						<a href="" class="navText">MUSIC</a>
						<a href="" class="navText">SUPPORT</a>
					</div>
				</div>
			 </div>		
		</div>
		<div class="banner">
			<h1>IPhone SE</h1>
			<h2>称心趁手,超值入手 </br>RMB 3299 起</h2>
			<p>折抵换购，仅 RMB 96 每月或 RMB 2299 起。</p>
			<div class="link">
				<a href="">进一步了解 </a><span>></span><a href="">购买 </a><span>></span>
			</div>
		</div>
		<!-- <div class="banner">
			<h1>IPhone 11</h1>
			<h2>一切都刚刚好</h2>
			<p>折抵换购，仅 RMB 175 每月或 RMB 4199 起。</p>
			<div class="link">
				<a href="">进一步了解 </a><span>></span><a href="">购买 </a><span>></span>
			</div>
		</div> -->
		<div class="hbanner">
			<div class="banner">
				<h1>Apple 特别活动</h1>
				<h2>北京时间 9 月 16 日凌晨 1 点，<br/>我们到时见。</h2>
				<div class="link">
					<a href="">进一步了解 </a><span>></span>
				</div>
			</div>
			<div class="banner">
				<h1>为高校生活购买<br/>Mac 或 iPad，<br>AirPods 搭配其中。</h1>
				<div class="link">
					<a href="">选购 </a><span>></span>
				</div>
			</div>
		</div>
		
		<div class="hbanner2">
			<div class="banner">
				<h1>力保个人信息安全，<br/>这很 iPhone。</h1>
				<div class="link">
					<a href="">进一步了解 </a><span>></span>
				</div>
			</div>
			<div class="banner">
				<h1>将 Apple 的实力，<br/>化为你业务的助力。</h1>
				<div class="link">
					<a href="">进一步了解 </a><span>></span>
				</div>
			</div>
		</div>
		
		<div class="hbanner3">
			<div class="banner">
				<h1>
					<span class="visuallyhidden">Apple Music</span>
				</h1>
				<h2>Katy Perry 全新专辑《Smile》上线，<br/>听起来，笑起来。</h2>
				<div class="link">
					<a href="">免费试用 </a><span>></span> <a href="">进一步了解 </a><span>></span>
				</div>
			</div>
			<div class="banner">
				<h1>MacBook Air</h1>
				<h2>速度加倍，容量翻番。<br/>听起来，笑起来。</h2>
				<p>现 RMB 7999 起售</p>
				<div class="link">
					<a href="">进一步了解 </a><span>></span> <a href="">选购 </a><span>></span>
				</div>
			</div>
		</div>
		
		
	</body>
</html>
